<template>
	<div class="banner_title">
		<div class="t1">
			{{ projectTitle }}
			{{ lang.banner_title1[lp] }}<br>
			{{ lang.banner_title2[lp] }}
		</div>
		<div class="t2 hidden-xs hidden-sm">{{lang.banner_title3[lp]}}</div>
	</div>
</template>

<script>
	//引用资源
	import { mixins } from '@/mixins/mixins'
	import { lang_banner } from '@/libs/lang'

	//导出
	export default {
		name:"banner",
		components:{},
		mixins:[mixins],
		props:{},
		data () {
			return {
				lang:Object.freeze(lang_banner),
			}
		},
		computed:{
		},
		methods:{

		},
		created () {

		}
	}
</script>

<style lang="less" >

	/*公共变量*/
	@import '~@/assets/global.less';

	/*banner标题*/
	.banner_title{padding:1vw 0px 1vw;text-align: center;}
	.banner_title .t1{color:#fff;font-size:2.2vw;font-weight: bold;margin-top: 1vw;text-shadow: 2px 2px 5px rgba(0,0,0,0.3)}
	.banner_title .t2{color:#fff;font-size:16px;margin-top: 1vw;opacity: 0.7;text-shadow: 2px 2px 2px rgba(0,0,0,0.2)}
	.banner_title .t3{color:#e00;font-size:14px;font-weigh:bold;margin-top: 1vw;background-color:#ffe800;display: inline-block;padding:5px;}
	.banner_title .t4 {}
	.banner_title .t4 .t4-con{background:#fff;display:flex;align-items: center;justify-content: center}


	/**********************适应************************/
	@media screen and (max-width: @MINSCREEN){
		.banner_title{margin-top: 0px;;padding:5vw 0px 5vw;}
		.banner_title .t1{color:#fff;font-size:22px;margin-top: 0vw;padding:10px 0px;text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.3)}
		.banner_title .t2{color:#353e4c;font-size:1vw;margin-top: 1vw;opacity: 0.7}
		.banner_title .t3{font-size: 14px;margin-top: 10px;}
	}
</style>
